{% extends "userpage.html" %}

{% block title %}Edit Account Profile - {{super()}}{% endblock %}

{% block body %}

# if saved
	<div class="disappear success plus1" style="position:absolute;top:15px;right:15px;width:250px;text-align:center;">
		{{saved}}
	</div>
# endif

<form action="/profile" method="post">
<h3>Edit Account Profile</h3> 

<div style="text-align:right;width:400px;" id="profile" class="plus1">
	<br />
	<label for="username">Username</label><div style="width:222px;margin-left:12px;float:right;text-align:left;">{{user.username}}</div><br />
	<label for="email">Email</label><input type="text" value="{{email or user.email}}" name="email" id="email" /><br />
	<label for="name">Name</label><input type="text" value="{{name or user.name or ''}}" name="name" id="name" /><br />	<label for="phone">Phone</label><input type="text" value="{{phone or user.phone or ''}}" name="phone" id="phone" /><br />	<label for="address">Address</label><input type="text" value="{{address or user.address or ''}}" name="address" id="address" /><br /><br />
	<button name="action" value="profile" type="submit" class="order-btn order-submit">&nbsp; Save &nbsp;</button>
	
	
	# if error
		<br /><br />
		<div class="disappear plus1 error" style="text-align:center;">{{error}}</div>
	# else
		<br /><br /><br />
	# endif
	
	<label for="pwd">Current Password</label><input type="password" value="" name="old_password" id="pwd" /><br />
	<label for="pwd">New Password</label><input type="password" value="" name="password" id="pwd" /><br />
	<label for="pwd2">Verify Password</label><input type="password" value="" name="password2" id="pwd2" /><br /><br />
	<button name="action" value="profile-password" type="submit" class="order-btn order-submit">&nbsp; Change Password &nbsp;</button>
	
</div>
<script type="text/javascript">
	/* // foregoing js validation in favor of just server validation
	var erred = false;
	function err(s) {
		erred = true;
		$('#error').html(s).show();
	}
	$('.upload-btn').click(function() {
		$('#error').hide();
		erred = false;
		
		if (!$.trim($('#data').val())) {
			err('Missing Product List data!');
			$('#data').focus();
		}
		if (!$.trim($('#name').val())) {
			err('Missing name!');
			$('#name').focus();
		}
		
		return !erred;
	});
	*/

	setTimeout(function() {
		$('.disappear.success').fadeOut();	
	}, 2800);
	setTimeout(function() {
		$('.disappear.error').fadeOut();	
	}, 30 * 1000);
	
</script>


</form>
{% endblock %}
